﻿import * as wjcCore from 'wijmo/wijmo';
import * as wjcGrid from 'wijmo/wijmo.grid';
import { DataSvc } from './DataSvc';


import { Component, EventEmitter, Input, Inject, enableProdMode, ViewChild } from '@angular/core';

declare var $: any;

'use strict';
@Component({
    moduleId: module.id,
    selector: 'sd-home',
    templateUrl: 'postmanagement.component.html',
    styleUrls: ['postmanagement.component.css']
})

export class PostmanagementComponent {
    protected dataSvc: DataSvc;
    cvPaging: wjcCore.CollectionView
    cvPaging2: wjcGrid.FlexGrid;

    constructor( @Inject(DataSvc) dataSvc: DataSvc) {
        this.dataSvc = dataSvc;
        this.cvPaging = new wjcCore.CollectionView;
        
    }

    cNodes = [
        { id: 1, pId: 0, name: "IT部门", open: true },
        { id: 11, pId: 1, name: "技术部", },
        { id: 111, pId: 11, name: "前端部门" },
        { id: 12, pId: 1, name: "运维部", },
        { id: 121, pId: 12, name: "运维技术部" },
        { id: 13, pId: 1, name: "研发部", },
        { id: 131, pId: 13, name: "UI部门", },
        { id: 132, pId: 13, name: "产品设计", },
        { id: 133, pId: 13, name: "市场调查", },
        { id: 134, pId: 13, name: "市场分析", },
        { id: 135, pId: 13, name: "市场主管", },
        { id: 136, pId: 13, name: "市场助理", },
        { id: 2, pId: 0, name: "财务部门", open: true },
        { id: 21, pId: 2, name: "财务部", },
        { id: 221, pId: 21, name: "财务科长", },
        { id: 222, pId: 21, name: "财务副科长" },
        { id: 223, pId: 21, name: "会计", },
        { id: 234, pId: 21, name: "审计科长" },
        { id: 2341, pId: 234, name: "审计副科长" },
        { id: 2342, pId: 234, name: "核对副科长", },
        { id: 235, pId: 21, name: "出纳" },
        { id: 236, pId: 21, name: "会计行政" },
        { id: 3, pId: 0, name: "市场部", open: true },
        { id: 31, pId: 3, name: "总经理" },
        { id: 321, pId: 31, name: "市场1部主管" },
        { id: 322, pId: 31, name: "市场2部主管" },
        { id: 323, pId: 31, name: "市场3部主管" },
        { id: 334, pId: 31, name: "市场4部主管" },
        { id: 3341, pId: 334, name: "副主管" },
        { id: 3342, pId: 334, name: "市场监督主管" },
        { id: 335, pId: 31, name: "市场品质部主管" },
        { id: 336, pId: 31, name: "市场调研部" },
    ];

    Psetting = {

        data: {
            simpleData: {
                enable: true,
                idkey: 'id',
                pIdkey: 'pId',
                rootPId: 0,
            },
            key: {
                name: "name",
            },
            keep: {
                parent: false,
            }
        },
        edit: {
            enable: true,
            removeTitle: '删除',
            renameTitle: '编辑',
            drag: {
                isMove: true,
                isCopy: false,
            },
        },
        view: {
            nameIsHTML: true,
            expandSpeed: 'fast'
        },
        callback: {
            beforeRemove: this.zTreeBeforeRemove,
            beforeRename: this.zTreeBeforeRename,
        }
    };


    //当点击ztree中节点的编辑按钮则实现对节点标题进行修改。
    zTreeBeforeRename = function (treeId: number, treeNode: any[], newName: any[], isCancel: any[]) {

        $.ajax({
            url: '',
            data: {

            },
            type: 'PUT',
            dataType: 'json',
            async: false, //同步请求
            success: function (response: any) {
                isCancel = response.IsSuccess;
            },
            error: function (err: string) {
                console.log(err);
            }
        });

        return isCancel;
    };

    //当点击ztree中节点的删除按钮则删除该节点及其子节点。
    zTreeBeforeRemove = function (treeId: any[], treeNode: any[]) {

        var result = confirm('是否删除部门？');
        if (!result)
            return false;

        $.ajax({
            url: '',
            data: {

            },
            type: 'DELETE',
            dataType: 'json',
            async: false, //同步请求
            success: function (response: any) {
                result = response.IsSuccess;
            },
            error: function (err: string) {
                console.log(err);
            }
        });

        return result;
    };
    changeBoxBodyPost = function () {

        var that = this;
        $('tbody').html('');
        if ($('.content-wrapper').hasClass('fullScreen')) {
            var height = $(window).height() - 182;
        } else {
            height = $(window).height() - 244;
        }
        $('#postmanagement').slimScroll({ 'height': height });
        $('div.postmangement').css({ 'height': height });
        var TableHeight = $('div.postmangement').height() - 130;
        $('.Table').css({ 'height': TableHeight });
        that.cvPaging = new wjcCore.CollectionView(that.dataSvc.getData());
        that.cvPaging.pageSize = Math.floor(TableHeight / 28);
        that.cvPaging2 = new wjcGrid.FlexGrid('#flexgrid', {
            autoGenerateColumns: false,
            columns: [
                { header: '编号', binding: 'id' ,width:60},
                { header: '编码', binding: 'code' },
                { header: '岗位', binding: 'name',  },
                { header: '描述', binding: 'description', width: '*' },
                { header: ' ', binding: ' ', width: 30 },
            ],
            itemsSource: this.dataSvc.getData(),   
        });
        var hoverRow = -1;
        that.cvPaging2.hostElement.addEventListener('mouseenter', function (e: MouseEventInit) {
            var ht = that.cvPaging2.hitTest(e),
                r = ht.row;
            console.log(r);
            if (r != hoverRow) {  
                that.cvPaging2.rows[r].cssClass= 'test';
                console.info(that.cvPaging2.rows[r].style, 123);
                hoverRow= r ;   
            }
        })

    };
    ngOnInit() {
        $.fn.zTree.init($("#postmanagement-tree"), this.Psetting, this.cNodes);
        var that = this;
        $(window).ready(function () {
            that.changeBoxBodyPost();
        });

        $(window).resize(function () {
            that.changeBoxBodyPost();
        });
       
    };


    fullScreeToggle = function () {
        var backgroundColor = $('.content-wrapper').css('background');
        var that = this;

        $('.fixed .content-wrapper').fullScreen({

            'background': backgroundColor,
            'marginLeft': 0,
            'paddingTop': 0,
            'callback': function (isFullScreen: boolean) {
                if (isFullScreen == true) {
                    $('.btn-group span').html('退出全屏').attr('title', '退出全屏');
                    $('.content-wrapper').css({ 'padding-top': 0, 'margin-left': 0 });
                    var Height = $(window).height() - 182;
                    $('#postmanagement').slimScroll({ 'height': Height });
                    $('.postmangementtable').css({ 'height': Height });
                    return;
                }

                $('.btn-group span').html('全屏').attr('title', '全屏');
                $('.content-wrapper').css({ 'padding-top': '60px', 'margin-left': '230px' });
                that.changeBoxBodyPost();
            }
        });
    };

    expandAll = function () {
        var treeObj = $.fn.zTree.getZTreeObj('postmanagement-tree');
        treeObj.expandAll(true);
    };
    collapse = function () {
        $.fn.zTree.init($("#postmanagement-tree"), this.Psetting, this.cNodes);
    };
    refreshPostmanagement = function () {
        $.fn.zTree.init($("#postmanagement-tree"), this.Psetting, this.cNodes);
    };
    addPostmanagement = function () {
        var that = this;
        var PostmanagementName = $('input[name="name"]').val();
        var PostmanagementCodenumber = $('input[name="codenumber"]').val();
        var PostManagementDescription = $('input[name="description"]').val();
        var treeObj = $.fn.zTree.getZTreeObj("postmanagement-tree");
        var nodes = treeObj.getSelectedNodes();
        if (nodes == '') {
            alert('请选择部门！');
            return;
        }

        if (PostmanagementName == "") {
            alert('组织名称必填！');
            return;
        }
        if (PostmanagementCodenumber == "") {
            alert('岗位编码不能为空！');
            return;
        }
        if (PostManagementDescription == "") {
            alert('岗位描述不能为空！');
            return;
        }
        var newPost = {
            id: '',
            name: '',
            description: '',
            code: '',
            ' ': '...'
        };
        var data = that.dataSvc.getData();
        newPost.id = data[data.length - 1].id + 1;
        newPost.name = PostmanagementName;
        newPost.description = PostManagementDescription;
        newPost.code = 'code00' + newPost.id;
        data.unshift(newPost);
        that.cvPaging = new wjcCore.CollectionView(data);
        var TableHeight = $('div.postmangement').height() - 130;
        that.cvPaging.pageSize = Math.floor(TableHeight / 30);
    };
    removePostmanagement = function () {
        var that = this;
        that.cvPaging.remove(that.cvPaging.currentItem);
    };
    revisePostmanagement = function () {
        //提交数据 data = that.cvPaging.SourceItem         
    };
    
    selectOperation = function (event:MouseEventInit) {
        var e = event || window.event;
        var top = e.clientY-145 +'px';
        $('#settingOperation').css({ "top": top, "display": 'block', });
        setTimeout(function () {
            $('#settingOperation').hide()
        }, 2000);
    };
    //下属岗位点击事件
    setSubordinatepost = function () {
        alert(123);
    };
}